<script setup lang="ts">
defineProps({
  title: {
    type: String,
    default: '',
  },
  value: {
    type: String,
    default: '',
  },
  tags: {
    type: Array as PropType<string[]>,
    default: () => [],
  },
})
</script>

<template>
  <view class="flex items-center rounded-lg bg-white px-[15px] py-[13px]">
    <view class="flex items-center">
      <wd-text :text="title" size="14px" color="#333333" />
      <template v-for="tag in tags" :key="tag">
        <view
          class="ml-2 h-[15px] flex items-center border-1 border-[#D7D7D7] rounded-sm border-solid px-[5px] text-center"
        >
          <text class="text-[10px] text-[#7F7F7F]">
            {{ tag }}
          </text>
        </view>
      </template>
    </view>
    <view class="flex-1 text-right">
      <wd-text :text="value" size="14px" color="#333333" />
      <wd-icon name="chevron-right" color="#bfbfbf" size="18px" />
    </view>
  </view>
</template>

<style scoped lang="scss"></style>
